<template>
	<view class="product-card" @click="$xyfun.to('/pages/shop/detail?id='+item.id)">
    <image class="product-img" :src=" $xyfun.image(item.image)"></image>
    <view class="product-info">
      <text class="product-name">{{ item.title }}</text>
      <view class="flex just-sb ali-end m-t-20">
        <text class="flex">
          <text class="ts-24 tc-r">￥</text>
          <text class="ts-28 tc-r">{{ item.price }}</text>
          <text class="ts-22 m-l-5 tc-999">起</text>
          <text class="ts-22 m-l-10 tdl tc-999">￥{{ item.line_price }}</text>
        </text>
        <view class="yz-iconfont yz-gouwuche" @click.stop="addCart(item)"></view>
      </view>
    </view>
	</view>
</template>
<script>
	export default {
		name: "xyGoodsRow2",
		props: {
			item: {
				type: Object,
			}
		},
		data() {
			return {

			};
		},
		methods: {
			async onLink(id){
				this.$Router.push({
					path: '/pages/shop/detail',
					query: {id:id},
				});
			},
      addCart(item){
        this.$emit('addCart', item);
      }
		}
	}
</script>
<style lang="scss">
.product-card {
  background: white;
  border-radius: 8px;
  overflow: hidden;
  width: 300rpx;
  margin-bottom: 40rpx;
  &:nth-of-type(2n-1){
    margin-right: 4%;
  }
  .product-img {
    width: 300rpx;
    height: 300rpx;
    display: block;
  }

  .product-info {
    padding: 8px;
    .product-name {
      display: block;
      font-size: 26rpx;
      color: #999999;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
    .yz-iconfont{
      color: $theme1;
      border: 1rpx solid $theme1;
      border-radius: 50%;
      padding: 4rpx;
    }
  }

}
</style>
